<template>
  <div class="ui-content">
    <!-- <img class="logo" src="../assets/img/logo.png"> -->
    <div class="page_box">
      <div class="line_box flex-star">
        <svg class="icon" aria-hidden="true">
          <use xlink:href="#icon-left"></use>
        </svg>
        <input type="text" name="" id="" placeholder="请输入手机" />
      </div>
      <div class="line_box flex-between">
        <div class="flex-star">
          <svg class="icon" aria-hidden="true">
            <use xlink:href="#icon-left"></use>
          </svg>
          <input type="text" name="" id="" placeholder="请输入手机" />
        </div>
        <input type="button" name="" @click="f1" id="" value="获取验证码" />
      </div>
      <div class="login_more flex-between">
        <div class="flex-star">
          <input type="checkbox" name="" id="" value="" />
          <span>记住密码</span>
        </div>
        <a href="">忘记密码?</a>
      </div>
      <router-link to="/home">
        <input type="button" class="login_btn" name="" id="" value="登录" />
      </router-link>
      <input type="button" class="zhuc" name="" id="" value="注册" />
    </div>
  </div>
</template>

<script>
  export default {
    data() {
      return {}
    },
    components: {},
    methods: {
      f1() {
        alert(1111111111)
      }
    }
  }
</script>

<style scoped="scoped">
  .ui-content{
    background-color: #e4d579;
  }
  
  .logo {
    width: 3.2rem;
    margin: .9rem calc(50% - 1.6rem);
  }

  .page_box {
    background: white;
    padding: .2rem .24rem .7rem .24rem;
    width: calc(100% - .48rem);
    margin: 0 .24rem;
    border-radius: 6px;

  }

  .line_box {
    border-bottom: 1px solid #ececec;
    padding: .5rem 0 .15rem 0;
  }

  .line_box svg {
    height: .4rem;
    fill: #6a6a6a;
    margin-right: .1rem;
    width: .4rem;
  }

  .login_more {
    padding: .4rem 0;
    font-size: .24rem;
  }

  .login_more input {
    width: .3rem;
    height: .3rem;
  }

  .line_box input[type=button] {
    background: transparent;
    border: none;
    color: #e4d579;
  }

  .zhuc,
  .login_btn {
    width: 100%;
    height: .85rem;
    background: #e4d579;
    border: none;
    color: white;
    font-size: .4rem;
    border-radius: 6px;
  }

  .zhuc {
    background: transparent;
    color: #999;
    font-size: .4rem;
  }
</style>
